<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<!--
* Copyright 2010-2012 Research In Motion Limited.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<div data-bb-type="screen" data-bb-effect="fade">
	<div data-bb-type="image-list" data-bb-header-justify="left" >
		<div data-bb-type="header">BlackBerry 10 Only</div>
		<div data-bb-type="item" onclick="bb.pushScreen('grid.htm', 'grid');" data-bb-img="images/icons/icon6.png" data-bb-title="Landscape Image Grid">Layout content in an Image Grid</div>
		<div data-bb-type="item" onclick="bb.pushScreen('gridSquare.htm', 'gridSquare');" data-bb-img="images/icons/icon4.png" data-bb-title="Square Image Grid">Layout content in an Image Grid</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('imageListAndGrid.htm', 'imageListAndGrid');" data-bb-img="images/icons/icon10.png" data-bb-title="Grid &amp; Image List">Combine a Grid and Image list</div>
		<div data-bb-type="item" onclick="bb.pushScreen('contextMenu.htm', 'contextMenu');" data-bb-img="images/icons/icon9.png" data-bb-title="Context Menu">Create a context sensitive menu</div>
		<div data-bb-type="item" onclick="bb.pushScreen('actionBar.htm', 'actionBar');" data-bb-img="images/icons/icon22.png" data-bb-title="Action Bar">Create a set of actions for your user</div>
		<div data-bb-type="item" onclick="bb.pushScreen('toggle.htm', 'toggle');" data-bb-img="images/icons/icon19.png" data-bb-title="Toggle Switch">Provide Yes/No options</div>
		<div data-bb-type="item" onclick="bb.pushScreen('imageListAddButtons.htm', 'imageListAddButtons');" data-bb-img="images/icons/icon1.png" data-bb-title="Add/Remove Lists">Add/Remove items from a list</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('moreButtonList.htm', 'moreButtonList');" data-bb-img="images/icons/icon11.png" data-bb-title="Arrow Button Lists">Add arrow buttons to your list</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('titlePillButtons.htm', 'titlePillButtons');" data-bb-img="images/icons/icon7.png" data-bb-title="Pill Buttons in Title">Add pill buttons to title area</div> 
		<div data-bb-type="header">Lists</div>
		<div data-bb-type="item" onclick="bb.pushScreen('inboxList.htm', 'inboxList');" data-bb-img="images/icons/icon5.png" data-bb-title="Inbox List">Style your list like the BlackBerry Inbox</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('imageList.htm', 'imageList');" data-bb-img="images/icons/icon20.png" data-bb-title="Image List">Display items with images</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('listWithoutImages.htm', 'listWithoutImages');" data-bb-img="images/icons/icon8.png" data-bb-title="Text List">Create a list of items using only text</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('arrowList.htm', 'arrowList');" data-bb-img="images/icons/icon18.png" data-bb-title="Arrow List">Create a navigation list with arrows</div>		
		<div data-bb-type="item" onclick="bb.pushScreen('bbmBubbles.htm', 'bbmBubbles');" data-bb-img="images/icons/icon2.png" data-bb-title="BBM Bubbles">Generate a chat window like BBM</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('scrollPanel.htm', 'scrollPanel');" data-bb-img="images/icons/icon6.png" data-bb-title="Scrolling Panel">Scroll content in a fixed area</div> 
		<div data-bb-type="header">Controls</div>
		<div data-bb-type="item" onclick="bb.pushScreen('activityIndicator.htm', 'activityIndicator');" data-bb-img="images/icons/icon12.png" data-bb-title="Activity Indicator">Let your user know you&apos;re processing</div>
		<div data-bb-type="item" onclick="bb.pushScreen('checkboxes.htm', 'checkboxes');" data-bb-img="images/icons/icon25.png" data-bb-title="Checkboxes">Give your user multiple options</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('input.htm', 'input');" data-bb-img="images/icons/icon1.png" data-bb-title="Input Controls">Use native looking input controls</div>
		<div data-bb-type="item" onclick="bb.pushScreen('pillButtons.htm', 'pillButtons');" data-bb-img="images/icons/icon7.png" data-bb-title="Pill Buttons">Use pill buttons to organize your data</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('menuBar.htm', 'menuBar');" data-bb-img="images/icons/icon15.png" data-bb-title="Menus">Create native looking menus</div>
		<div data-bb-type="item" onclick="bb.pushScreen('slider.htm', 'slider');" data-bb-img="images/icons/icon11.png" data-bb-title="Slider">Use a slider to change values</div>
		<div data-bb-type="item" onclick="bb.pushScreen('gauge.htm', 'gauge');" data-bb-img="images/icons/icon13.png" data-bb-title="Progress Bars">Show status using progress bars</div> 
		<div data-bb-type="item" onclick="bb.pushScreen('radio.htm', 'radio');" data-bb-img="images/icons/icon19.png" data-bb-title="Radio Buttons">Give your user some options</div> 
		<div data-bb-type="header">PlayBook Examples</div>
		<div data-bb-type="item" onclick="bb.pushScreen('masterDetail.htm', 'masterDetail');" data-bb-img="images/icons/icon6.png" data-bb-title="Landscape Master/Detail">Two landscape scrolling areas</div> 
		<div data-bb-type="header">BlackBerry 7 Examples</div>
		<div data-bb-type="item" onclick="bb.pushScreen('settings.htm', 'settings');" data-bb-img="images/icons/icon3.png" data-bb-title="Settings Screen">Create native looking options screens</div> 		
		<div data-bb-type="header">Dynamic Screen Content</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dataOnLoad.htm', 'dataOnLoad');" data-bb-img="images/icons/icon12.png" data-bb-title="Load Data Before Showing">Using the onscreenready event</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dataOnTheFly.htm', 'dataOnTheFly');" data-bb-img="images/icons/icon16.png" data-bb-title="Load Data After Showing">Using the ondomready event</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicButtons.htm', 'dynamicButtons');" data-bb-img="images/icons/icon2.png" data-bb-title="Dynamic Buttons">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicDropDowns.htm', 'dynamicDropDowns');" data-bb-img="images/icons/icon3.png" data-bb-title="Dynamic DropDowns">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicActionBar.htm', 'dynamicActionBar');" data-bb-img="images/icons/icon4.png" data-bb-title="Dynamic Action Bar">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicCheckBoxes.htm', 'dynamicCheckBoxes');" data-bb-img="images/icons/icon1.png" data-bb-title="Dynamic CheckBoxes">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicRadioButtons.htm', 'dynamicRadioButtons');" data-bb-img="images/icons/icon7.png" data-bb-title="Dynamic Radio Buttons">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicToggle.htm', 'dynamicToggle');" data-bb-img="images/icons/icon18.png" data-bb-title="Dynamic Toggle Buttons">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicBubbles.htm', 'dynamicBubbles');" data-bb-img="images/icons/icon12.png" data-bb-title="Dynamic BBM Bubbles">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicProgress.htm', 'dynamicProgress');" data-bb-img="images/icons/icon8.png" data-bb-title="Dynamic Progress Bar">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicPillButtons.htm', 'dynamicPillButtons');" data-bb-img="images/icons/icon25.png" data-bb-title="Dynamic Pill Buttons">Using JavaScript interfaces</div>
		<div data-bb-type="item" onclick="bb.pushScreen('dynamicInputs.htm', 'dynamicInputs');" data-bb-img="images/icons/icon17.png" data-bb-title="Dynamic Inputs">Using JavaScript interfaces</div>
	</div>
</div>
	
